<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@include file="../base/base.jspf" %>
<div class="layui-form" style="padding: 47px 0 0 70px;">
    <input type="hidden" name="disId" value="${dict.disId}"/>
    <div class="layui-col-xs12">
        <div class="layui-form-item">
            <label class="layui-form-label">字典类型</label>
            <div class="layui-input-inline">
                <select  lay-filter="dict-type-select" id="dict-type-select" <c:if test="${null != dict.disId }">disabled</c:if>>
                    <option value="请选择" placeholder="请选择"></option>
                    <option value="">新增字典类型</option>
                    <c:forEach var="dic" items="${dics }">
                        <option value="${dic.disType }" <c:if test="${dic.disType eq dict.disType}">selected="selected"</c:if>>${dic.disTypeName }</option>
                    </c:forEach>
                </select>
            </div>
        </div>

        <div class="layui-form-item" style="display: none"  id="dict-dictSubmitPage-tr-type" >
            <label class="layui-form-label">字典类型</label>
            <div class="layui-input-inline">
                <input type="text" id="dict-dictSubmitPage-type" name="disType"
                       placeholder="请输入字典类型" class="layui-input" value="${dict.disType}" lay-verify="required"/>
            </div>
        </div>

        <div class="layui-form-item" style="display: none" id="dict-dictSubmitPage-tr-typeName">
            <label class="layui-form-label">类型名称</label>
            <div class="layui-input-inline">
                <input type="text"  id="dict-dictSubmitPage-typeName" name="disTypeName"
                       placeholder="请输入类型名称" class="layui-input" value="${dict.disTypeName}" lay-verify="required"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">等级</label>
            <div class="layui-input-inline">
                <select name="disLevel" lay-filter="dict-level-select" id="dict-level-select">
                    <option value="1" <c:if test="${1 == dict.disLevel}">selected</c:if>>1</option>
                    <option value="2" <c:if test="${2 == dict.disLevel}">selected</c:if>>2</option>
                    <option value="3" <c:if test="${3 == dict.disLevel}">selected</c:if>>3</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item" <c:if test="${1 == dict.disLevel || null == dict.disLevel}">style="display: none"</c:if> id="dict-level-tr-typeName">
            <label class="layui-form-label">上级</label>
            <div class="layui-input-inline">
                <select name="disParentCode" id="disParentCode">
                    <option value="" placeholder="请选择"></option>
                    <c:forEach items="${dictLevel}" var="gtype">
                        <option value="${gtype.disCode}" <c:if test="${gtype.disCode == dict.disParentCode}">selected</c:if>>${gtype.disCodeName}</option>
                    </c:forEach>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">字典值</label>
            <div class="layui-input-inline">
                <input type="text" autocomplete="off" lay-verify="required" id="dict-dictSubmitPage-code" name="disCode"
                       placeholder="请输入字典值" value="${dict.disCode}" class="layui-input">
                <span style="color: red;">*字典值和下面得排序号尽量保持一致</span>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">字典名称</label>
            <div class="layui-input-inline">
                <input type="text" autocomplete="off" id="dict-dictSubmitPage-codeName" name="disCodeName"
                       placeholder="请输入字典名称" value="${dict.disCodeName}"
                       lay-verify="required" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">排序号</label>
            <div class="layui-input-inline">
                <input type="number" id="dict-dictSubmitPage-sort" name="disSort"  autocomplete="off"
                       placeholder="请输入排序号" class="layui-input" value="${dict.disSort}" lay-verify="required|number"/>
            </div>
        </div>
        <c:choose>
            <c:when test="${empty dict.disId}">
                <input type="hidden" name="disStt" value="1"/>
            </c:when>
            <c:otherwise>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否启用：</label>
                    <div class="layui-input-block" id="resource-resourcePage-status">
                        <input type="checkbox" name="disStt" lay-skin="switch" lay-text="启用|停用" <c:if test="${dict.disStt eq '1'}">checked="checked"</c:if>>
                    </div>
                </div>

            </c:otherwise>
        </c:choose>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit id="dict-front-submit" lay-filter="dict-front-submit" value="确认"/>
    </div>
</div>

<script type="text/javascript">
    layui.config({
        base: "${ctx}/static/framework/layuiadmin/" //静态资源所在路径
    }).extend({
        index: "lib/index" //主入口模块
    }).use(["index", "jquery", "form"], function () {
        var $ = layui.jquery, form = layui.form;

        form.on("submit(dict-front-submit)", function (data) {
            $("#dict-front-submit").attr("disabled",true);
            var field = data.field;
            if (field.disStt || field.disStt == "启用") {
                field.disStt = "1";
            } else {
                field.disStt = "0";
            }
            tip_index = load();
            $.ajax({
                async: true,
                url: "${ctx}/dict/dictSubmit",
                type: "post",
                dataType: "json",
                data: field,
                success: function (data) {
                    layer.close(tip_index);
                    if (data.result) {
                        parentTableReload("dict-page-data");
                        successUp(data.info);
                        closeDialog();
                    } else {
                        $("#dict-front-submit").attr("disabled",false);
                        error(data.info);
                    }
                }
            });
        });

        form.on("select(dict-type-select)", function (data) {
            chooseDictTypeName(data.value, data.elem[data.elem.selectedIndex].text);
        });

        form.on("select(dict-level-select)", function (data) {
            var dicttype = $("#dict-type-select").val();
            if(dicttype == '请选择'){
                error('请先选择字典类型');
                var htmls = '<option value="1">1</option><option value="2">2</option><option value="2">3</option>';
                $("#dict-level-select").html(htmls);
                form.render("select");
                return;
            }
            if (data.value ==1) {
                $("#dict-level-tr-typeName").css("display", "none");
            }else{
                $.ajax({
                    async: true,
                    url: "${ctx}/dict/getLevelByType",
                    type: "post",
                    data: {
                        dicttype: dicttype,
                        level:data.value
                    },
                    dataType: "json",
                    success: function (data) {
                        console.log(data)
                        if (data.result) {
                            var htmls = '<option value="">请选择</option>'; //全局变量
                            for(var pro in data.obj){
                                htmls += '<option value = "' + data.obj[pro].disCode + '">' + data.obj[pro].disCodeName+ '</option>'
                            }
                            $("#disParentCode").html(htmls);
                            form.render('select');//需要渲染一下
                        } else {
                            error(data.info);
                        }
                    }
                });
                $("#dict-level-tr-typeName").css("display", "block");
            }
        });


        function chooseDictTypeName(value,text) {
            $("#dict-dictSubmitPage-type").val("");
            $("#dict-dictSubmitPage-typeName").val("");
            if (!value) {
                $("#dict-dictSubmitPage-tr-type").css("display", "block");
                $("#dict-dictSubmitPage-tr-typeName").css("display", "block");
                $("#dict-dictSubmitPage-sort").val(1);
            } else {
                $("#dict-dictSubmitPage-type").val(value);
                $("#dict-dictSubmitPage-typeName").val(text);
                $("#dict-dictSubmitPage-tr-type").css("display", "none");
                $("#dict-dictSubmitPage-tr-typeName").css("display", "none");
                $.ajax({
                    async: true,
                    url: "${ctx}/dict/getMaxByType",
                    type: "post",
                    data: {
                        type: value
                    },
                    dataType: "json",
                    success: function (data) {
                        $("#dict-dictSubmitPage-sort").val(data + 1);
                    }
                });
            }
        }
    });
</script>
</body>
</html>